<script setup>
import {onMounted, ref} from "vue";
import {GetResume, UpdateResume} from "@/utils/api/graduate.js";
import {ElMessage, ElNotification} from "element-plus";
import {useUserLoginStore} from "@/stores/AccountLogin.js";

const sno = useUserLoginStore().getAccount;
const data = ref({
  sno:'',
  name: '',
  gender: '',
  dept:'',
  major: '',
  grade: '',
  phone: '',
  graduateDate: '',
  resume: '',
});

const genderFormat = (gender) => {
  return gender === 1 ? '男' : '女';
}

const getResume = () => {
  GetResume(sno)
      .then(result => {
        if (result.code === 1) {
          data.value = result.data;
        } else {
          ElMessage({
            message: '获取信息失败',
            type: 'warning'
          });
        }
      }).catch(error => console.error(error.toString()));
}

const updateResume = () => {
  UpdateResume(sno, data.value.resume)
      .then(result => {
        if (result.code === 1) {
          ElNotification({
            title: '更新成功',
            type: 'success',
          })
          setTimeout(getResume, 1000);
        } else {
          ElMessage({
            message: '更新失败',
            type: 'warning'
          })
        }
      }).catch(error => console.error(error.toString()));
}

onMounted(() => {
  getResume();
})

</script>

<template>
  <div class="main">
    <el-descriptions direction="vertical" border :column="3">
      <el-descriptions-item label="学 号">{{ data.sno }}</el-descriptions-item>
      <el-descriptions-item label="姓 名">{{ data.name }}</el-descriptions-item>
      <el-descriptions-item label="性 别">{{ genderFormat(data.gender) }}</el-descriptions-item>
      <el-descriptions-item label="年 级">{{ data.grade }}</el-descriptions-item>
      <el-descriptions-item label="学 院">{{ data.dept }}</el-descriptions-item>
      <el-descriptions-item label="专 业">{{ data.major }}</el-descriptions-item>
      <el-descriptions-item label="联系方式">{{ data.phone }}</el-descriptions-item>
      <el-descriptions-item label="毕业日期">{{ data.graduateDate }}</el-descriptions-item>
      <el-descriptions-item/>
      <el-descriptions-item label="简 历">
        <el-input type="textarea" :rows="10" v-model="data.resume"/>
      </el-descriptions-item>
    </el-descriptions>
    <div class="operation">
      <el-button type="primary" @click="data.resume = ''">重 置</el-button>
      <el-button type="success" @click="updateResume">保 存</el-button>
    </div>
  </div>
</template>

<style scoped>
.main {
  min-width: 1100px;
  padding-right: 50px;
}

.el-button {
  margin-left: 100px;
  margin-top: 20px;
}
</style>